<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
    <!-- 告诉IE使用最新的引擎渲染网页 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
	<title>课程</title>
	<link rel="stylesheet" type="text/css" href="plugins/bootstrap-3.3.7-dist/css/bootstrap.min.css">
	<link rel="stylesheet" type="text/css" href="plugins/swiper-4.3.3/css/swiper.min.css">
	<link rel="stylesheet" type="text/css" href="css/base.css">
	<link rel="stylesheet" type="text/css" href="css/curriculum.css">
</head>
<body>
<div class="container">
	<header>
		<div class="search-box"><input type="text" name="" placeholder="搜索您感兴趣的内容"><span class="glyphicon glyphicon-search"></span></div>
	</header>
	<!-- Swiper -->
	<div class="swiper-container">
	    <div class="swiper-wrapper">
	        <div class="swiper-slide"><img src="../images/pic/lunbo_2@2x.png"></div>
	        <div class="swiper-slide"><img src="../images/pic/lunbo_2@2x.png"></div>
	    </div>
	    <!-- Add Pagination -->
	    <div class="swiper-pagination"></div>
	</div>
	<div class="panel">
		<h2>免费专区</h2>
		<h3><em class="pull-left">好氧早读</em><a href="#" class="pull-right more">查看全部</a></h3>
		<ul class="list">
			<li><span class="glyphicon glyphicon-play-circle"></span><a href="#">景霎 一个阳光的孩子一定有一个阳光的家长</a></li>
		</ul>
		<h3><em>好氧读书会</em></h3>
		<ul class="list">
			<li><span class="glyphicon glyphicon-play-circle"></span><a href="#">景霎 一个阳光的孩子一定有一个阳光的家长</a></li>
			<li><span class="glyphicon glyphicon-play-circle"></span><a href="#">景霎 一个阳光的孩子一定有一个阳光的家长</a></li>
			<li><span class="glyphicon glyphicon-play-circle"></span><a href="#">景霎 一个阳光的孩子一定有一个阳光的家长</a></li>
		</ul>
	</div>
	<div class="panel">
		<h2>精品课</h2>
		<ul class="list-card">
			<li>
				<span class="img-wrap"></span>
				<h4>如何跟孩子进行沟通<span class="money">100氧币</span></h4>
				<p>家长的教育方式对孩子成长很重要，家长的教育方式对孩子成长很重要，对孩子的品行...</p>
				<span class="teacher">好氧老师</span>
				<span class="play-btn"><i class="glyphicon glyphicon-play"></i>试听</span>
			</li>
			<li>
				<span class="img-wrap"></span>
				<h4>如何跟孩子进行沟通<span class="money">100氧币</span></h4>
				<p>家长的教育方式对孩子成长很重要，对孩子的品行...</p>
				<span class="teacher">好氧老师</span>
				<span class="play-btn"><i class="glyphicon glyphicon-play"></i>试听</span>
			</li>
			<li>
				<span class="img-wrap"></span>
				<h4>如何跟孩子进行沟通<span class="money">100氧币</span></h4>
				<p>家长的教育方式对孩子成长很重要，对孩子的品行...</p>
				<span class="teacher">好氧老师</span>
				<span class="play-btn"><i class="glyphicon glyphicon-play"></i>试听</span>
			</li>
		</ul>
	</div>
	<footer>
		---我是有底线的---
	</footer>
	<nav>
		<ul>
			<li><a href="#"><span class="icon glyphicon glyphicon-home"></span><em>首页</em></a></li>
			<li><a href="#"><span class="icon glyphicon glyphicon-home"></span><em>课堂</em></a></li>
			<li><a href="#"><span class="icon glyphicon glyphicon-home"></span><em>问答</em></a></li>
			<li><a href="#"><span class="icon glyphicon glyphicon-user"></span><em>我的</em></a></li>
		</ul>
	</nav>
</div>
<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="plugins/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<script src="plugins/swiper-4.3.3/js/swiper.min.js"></script>
<!-- Initialize Swiper -->
<script>
    var swiper = new Swiper('.swiper-container', {
        pagination: {
            el: '.swiper-pagination',
        },
    });
</script>
</body>
</html>